<%@page import="com.exam.dao.StudentDao"%>
<%@ page language="java" import="java.util.*" pageEncoding="utf-8"%>
<%@ taglib prefix="s" uri="/struts-tags" %>
<%
String path = request.getContextPath();
String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";
%>
<!DOCTYPE html>
<html lang="zh-cn">
<jsp:include page="checkExam.jsp" />
<head>
	<meta charset="UTF-8">
	<meta name="viewport" content="width=device-width, initial-scale=1.0">
	<title>在线考试系统</title>
	<link rel="stylesheet" href="css/bootstrap.min.css">
	<link rel="stylesheet" href="css/style.css">
	<style>
		.top{
			background:#999;
			position: fixed;
    		top: 0;
    		color:#fff;
		}
		
		#infoTest ul li{
			margin:5px auto;
		}
		
		#showMyScore  ul li{
			margin:5px auto;
		}
	</style>
	<script src="js/jquery.js"></script>
	<script src="js/bootstrap.min.js"></script>
	<script src="js/bootstrap3-validation.js"></script>
	<script src="js/bootbox.min.js"></script>
	<script src="js/m.js"></script>
	<script>
		if("${paperInfo.lastTestTime }"==0){
			<%
				application.setAttribute("message", "考试已结束！");
			%>
			window.location.href = "<%=path%>/m/examLogout.action";	
		}
	</script>
		<script>
		$(function(){
			timer(intDiff);
			//显示试卷信息
			$("#showTest").click(function(){
					$("#infoTest").modal("show");
			});
			
			//结束考试
			$("#testFinshed").click(function(){
				location.href="<%=path%>/m/examLogout.action";
			});
			
			//提交试卷			
			$("#submitTest").click(function(){
				var btn = $(this);
				btn.html("试卷提交中...");
				btn.addClass("disabled");
				bootbox.confirm("试卷提交后无法修改！确定要提交试卷么 ?",function(result){
					if(result==true){
						var url = "submitPaper.action";
						var params = $("#submitPaperForm").serialize();
						$.post(url ,params ,function(score){
							//提交成功 可以查询id
							if(score>0){
								//打印成绩
								setTimeout(function(){
			   						var usetime = useTime();  //用时
			   						var myScore = "<ul>";
			   						myScore += "<li><b>姓名：</b>"+$("#s_name").html()+"</li>";
			   						myScore += "<li><b>学号：</b>"+$("#s_id").html()+"</li>";
			   						myScore += "<li><b>成绩：</b>"+score+"</li>";
			   						myScore += "<li><b>用时：</b>"+usetime+"</li>";
			   						
			   						var level = score/$("#p_total").html();
			   						if(level<0.6){
			   							myScore += "<p><img src='../images/g4.png' /> <span> 不忍直视,赶紧恶补一下吧!</span></p>";
			   						}else if(level>=0.6 && level< 0.75){
			   							myScore += "<p><img src='../images/g3.png' /> <span> 很危险,要继续努力呀!</span></p>";
			   						}else if(level>=0.75 && level< 0.9){
			   							myScore += "<p><img src='../images/g2.png' /> <span> 一般一般,世界第三!</span></p>";
			   						}else if(level>=0.9){
			   							myScore += "<p><img src='../images/g1.png' /> <span> 简直超神啦,继续保持哦!</span></p>";
			   						}		
			   						myScore += "</ul>";
			   						$("#showScore").html(myScore);
				   			   		$("#showMyScore").modal("show"); 
			   						btn.html("提交试卷");
			   						btn.removeClass("disabled");
			   					},500);
							}else{
								alertInfo("试卷提交失败!");
								btn.removeClass("disabled");
							}
						});
					}
				});
				return false;
			});
			
			
		});
		
		function selOption(opt){
			$(opt).addClass("selopt").siblings().removeClass("selopt");
			var aid = $(opt).find("input").attr("name");
			var myAnswer = $(opt).find("input").val();
			$("#"+aid).addClass("selected");
			$(opt).parent().find("input[name=myAnswer]").val(myAnswer);
		}
		
		/*
			计时器
		*/
		var intDiff = parseInt("${paperInfo.lastTestTime}");//倒计时总秒数量
		
		function timer(intDiff){
			window.setInterval(function(){
			var day=0,
				hour=0,
				minute=0,
				second=0;//时间默认值		
			if(intDiff > 0){
				day = Math.floor(intDiff / (60 * 60 * 24));
				hour = Math.floor(intDiff / (60 * 60)) - (day * 24);
				minute = Math.floor(intDiff / 60) - (day * 24 * 60) - (hour * 60);
				second = Math.floor(intDiff) - (day * 24 * 60 * 60) - (hour * 60 * 60) - (minute * 60);
			}else{
				//alert("时间到");
				// var fm = $("#submitPaperForm");
				//  fm.ajaxSubmit(options);
			}
			if (minute <= 9) minute = '0' + minute;
			if (second <= 9) second = '0' + second;
				$('#day_show').html(day+"天");
				$('#hour_show').html('<s id="h"></s>'+hour+'时');
				$('#minute_show').html('<s></s>'+minute+'分');
				$('#second_show').html('<s></s>'+second+'秒');
				$('#lastTime').html(intDiff);  //剩余时间
				intDiff--;
			}, 1000);
		} 
		
		//计算用时 
function useTime(){
		var lastTime = $('#lastTime').html();
		var totalTime = $('#p_time').html()*60;
		var intDiff = totalTime-lastTime;
	 	var day=0,hour=0,minute=0,second=0;//时间默认值		
		 if(intDiff > 0){
			hour = Math.floor(intDiff / (60 * 60)) - (day * 24);
			minute = Math.floor(intDiff / 60) - (day * 24 * 60) - (hour * 60);
			second = Math.floor(intDiff) - (day * 24 * 60 * 60) - (hour * 60 * 60) - (minute * 60);
		  } 
		 if (minute <= 9) minute = '0' + minute;
		 if (second <= 9) second = '0' + second;	 
		 return hour+" 小时  "+minute+" 分钟 "+second+" 秒 ";
	}
</script>
	
</head>
<body>
<span id="message" class="hide"></span>	
<span id="lastTime" class="hide"></span>
	<div class="container-fuld top">
			<div class="time">
				<span class="glyphicon glyphicon-time"></span>
				<span id="hour_show">0时</span>
				<span id="minute_show">0分</span>
				<span id="second_show">0秒</span>
			</div>
			<h1><button class="btn btn-primary btn-xs" id="showTest">查看试卷 </button> </h1>
			<a href="#" class="glyphicon glyphicon-user" title=" [${sessionScope.student }]" >${sessionScope.username }</a>	
		</div>
			<div class="container  paperMain">
					<h3 style="text-align:center;margin:0 auto 10px  auto;padding-bottom:10px;border-bottom:2px solid #ffeccc;">${paperInfo.paperName }</h3>
					 <form action="?" id="submitPaperForm">
					    <input type="hidden" name="realAnswer" value="${paperInfo.realAnswer }"/>
						<input type="hidden" name="pid" value="${paperInfo.id }"/>
						<input type="hidden" name="sid" value="${student.stu_id}"/>
						<input type="hidden" name="qscore" value="${paperInfo.totalScore/paperInfo.questionNum }">
						<div class="type">
							<h5>单项选择题</h5>
							一、单项选择题（本大题共${paperInfo.questionNum }小题，
							每小题 ${paperInfo.totalScore/paperInfo.questionNum } 分，
							共${paperInfo.totalScore}分。
							在每小题列出的四个备选项中只有一个是符合题目要求的，请点击选项选择正确的答案 ）
						</div>
						 <s:if test="#request.Question!=null">
					        <s:iterator value="#request.Question" status="list" id="question" var="qfm">
							<span id="m<s:property value="id"/>"></span>
							<dl class="question" >
								<dd>
								<input type="hidden" name="qids" value="<s:property value="id"/>"/>
								<input type="hidden" name="myAnswer" value="X"/>
								</dd>
								<dt><b>${list.index+1 }、</b>
								<s:property value="content"/>
								<s:property value="option[i]"/>
								</dt>
								<s:iterator value="option" status="opt">
									<dd class="option"  onclick="selOption(this)"><label>
									<s:if test="#opt.index==0">
									 <input type="radio" name="a${list.index }" value="A" /> A
									</s:if>
									<s:elseif test="#opt.index==1">
									<input type="radio" name="a${list.index }" value="B" /> B
									</s:elseif>
									<s:elseif test="#opt.index==2">
									<input type="radio" name="a${list.index }" value="C" /> C
									</s:elseif>
									<s:else>
									<input type="radio" name="a${list.index }" value="D" /> D
									</s:else>
									、<s:property /></label>
									</dd>
								</s:iterator>
							</dl>
						</s:iterator>
						</s:if>
					</form>
					<button class="btn btn-info btn-block" id="submitTest">提交试卷</button>
			</div>
			<div class="container-fuld" >
				<div class="copyright">
					版权所有@在线考试管理系统
				</div>
			</div>
</body>


<!-- 警告框  -->
<div class="modal  fade" data-backdrop="static"  id="alertInfo" style="z-index:9999">
      <div class="modal-dialog">
	      <div class="modal-content">
	      <div class="modal-header" >
	        <h3 class="icon-info" style="font-size:20px;margin:8px auto;"> 提示</h3>
	      </div>
	      <div class="modal-body">
	        <span class="alertContent"></span>
	      </div>
	      <div class="modal-footer">
	        <button class="btn btn-sm btn-danger" data-dismiss="modal" aria-hidden="true">关闭</button>
	      </div>
	      </div>
      </div>
 </div>
 
 <!-- 试卷信息框 -->
 <div class="modal fade" id="infoTest">
 	<div class="modal-dialog">
 		<div class="modal-content">
 			<div class="modal-header">
 				<h3>${paperInfo.paperName }</h3>
 			</div>
 			<div class="modal-body">
 				<div class="container">
 					<ul>
 						<li>当前考生： 	[ <b id="s_name">${student.stu_name }</b> ]</li>
 						<li>学　　号 ：[ <b id="s_id">${student.stu_id }</b> ]</li>
						<li>试卷共有：<b>${paperInfo.questionNum }</b>题</li>
						<li>卷面总分：<b  id="p_total">${paperInfo.totalScore }</b>分</li>
						<li>答题时间：<b id="p_time">${paperInfo.testTime }</b>分钟</li>
						<li>试卷来源：exam在线考试系统</li>
					</ul>
 				</div><!-- container --> 
 			</div>
 			<div class="modal-footer">
 				<button class="btn btn-danger" data-dismiss="modal">关闭</button>
 			</div>
 		</div>
 	</div>
 </div>
 
<!-- 成绩框 -->
<div class="modal fade" id="showMyScore">
	<div class="modal-dialog">
		<div class="modal-content">
			<div class="modal-header">
				<h4>我的成绩</h4>
			</div>
			<div class="modal-body">
				<div id="showScore">
					
				</div>
			</div>
			<div class="modal-footer">
				<button class="btn btn-danger" data-dismiss="modal" id="testFinshed">关闭走人</button>
			</div>
		</div>
	</div>
</div>

</html>


